<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>李霓的个人界面</title>

  <style>
    body {
      background-color: rgb(169, 208, 244);
      background-size: 100%;
      background-repeat: no-repeat;
      position: relative;
    }

    .wel {
      position: absolute;
      left: 40%;
      font-size: 25px;
    }

    .head img {
      width: 100px;
      height: 100px;
      border-radius: 50%;
    }

    .name {
      border: solid 4px rgb(3, 96, 154);
      height: 120px;
      width: 250px;
      border-radius: 20%;
      background-color: rgb(216, 249, 255, 70%);
    }

    p {
      font-size: 20px;
    }

    span {
      font-size: 25px;
    }

    .tcl {
      margin-top: 20px;
      border: solid 4px rgb(3, 96, 154);
      height: 120px;
      width: 250px;
      border-radius: 20%;
      position: relative;
      background-color: rgb(192, 246, 255, 40%);
    }

    .qq {
      position: absolute;
      top: 23px;
      left: 42px;
    }

    #icon2 {
      position: absolute;
      top: 70px;
      left: 0;
    }

    .tt {
      position: absolute;
      top: 75px;
      left: 42px;
    }

    .icon {
      position: absolute;
      top: 20px;
    }





    #wenzi {
      color: aliceblue;
    }

 
    .ido img {
      position: absolute;
      height: 150px;
      left: 1200px;
      top: 150px;
    }

    .work {
      position: absolute;
      height: 400px;
      width: 100%;
      top: 300px;
      background-color: rgb(3, 3, 3, 50%);
    }

    .zuoye {
      text-align: center;
      color: #fdfcfc;
      font-size: 30px;

    }

    a {
      display: block;
    }

    .one {
      height: 80px;
      width: 80px;
      border-radius: 50%;
      background-color: aqua;

    }
    
    .tow {
      position: absolute;
      height: 80px;
      width: 80px;
      border-radius: 50%;
      background-color: aqua;
      top: 100px;
      left: 100px;

    }

    .tow2 {
      position: absolute;
      height: 80px;
      width: 80px;
      border-radius: 50%;
      background-color: aqua;
      top: 100px;
      left: 200px;

    }

    .tow3 {
      position: absolute;
      height: 80px;
      width: 80px;
      border-radius: 50%;
      background-color: aqua;
      top: 100px;
      left: 300px;

    }

    .tow4 {
      position: absolute;
      height: 80px;
      width: 80px;
      border-radius: 50%;
      background-color: aqua;
      top: 100px;
      left: 400px;

    }
  .tow5{
       position: absolute;
      height: 80px;
      width: 80px;
      border-radius: 50%;
      background-color: aqua;
      top: 100px;
      left: 500px;

    }
  .tow6{
       position: absolute;
      height: 80px;
      width: 80px;
      border-radius: 50%;
      background-color: aqua;
      top: 100px;
      left: 600px;

    }
  .tow7{
       position: absolute;
      height: 80px;
      width: 80px;
      border-radius: 50%;
      background-color: aqua;
      top: 100px;
      left: 700px;

    }
    .one2 {
      line-height: 50px;
      text-align: center;
      font-size: 15px;

    }

    .one1 {
      line-height: 80px;
      text-align: center;
      font-size: 15px;

    }
  </style>
</head>

<body>
  <p class="wel">Welcome to my personal website</p>
  <!-- 头像 -->
  <div class="head">
   
  </div>
  <!-- 基本信息 -->
  <div class="name">
    <p>姓名: 李霓</p>
    <p>班级: 20数媒技3班</p>
  </div>
  <div class="tcl">
    <svg t="1677926830551" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
      p-id="981" width="40" height="40">
      <path
        d="M331.848 493.758l-0.966-2.971-0.774-3.897-0.539-2.145 0-8.761 0.928-3.434 0.964-3.669 1.235-3.819 1.68-4.247 2.219-4.438 3.125-4.437 0-3.127 0.308-2.895 0.465-3.976 1.352-4.4 1.235-4.826 0.981-2.198 1.141-2.065 1.464-2.296 1.583-1.678 0-10.98 0.925-5.655 0.927-6.561 1.66-7.854 2.277-8.161 1.698-4.496 1.679-4.903 1.832-4.554 2.203-4.9 2.237-5.327 2.585-5.036 2.896-5.347 3.667-5.346 1.678-3.047 1.814-2.529 3.918-5.636 4.013-5.634 4.594-5.809 4.902-5.654 5.326-5.558 5.558-5.732 6.715-6.176 4.287-3.744 5.19-4.033 5.267-3.589 5.71-3.434 5.484-3.051 6.174-2.508 6.562-3.145 6.525-2.141 6.521-2.201 7.024-2.202 7.024-1.697 7.409-1.369 7.489-1.216 14.78-2.008 7.876-0.425 23.275 0 7.757 0.964 7.794 0.926 7.954 0.849 7.37 1.757 7.796 1.679 7.316 1.889 8.01 2.143 7.331 2.604 7.025 2.973 7.489 3.125 6.85 3.436 6.637 3.803 6.505 4.206 5.633 3.878 2.588 2.22 2.742 1.602 5.206 4.437 4.403 4.265 4.36 4.419 4.284 4.901 3.509 4.71 4.172 4.902 2.933 5.248 2.952 4.669 3.145 5.404 2.585 4.748 4.4 9.997 2.16 5.171 1.679 4.804 1.68 5.19 1.505 4.883 1.08 4.189 1.353 4.977 2.39 8.839 1.526 7.719 0.983 7.468 0.849 6.019 1.353 9.166 0.308 1.448 1.081 1.679 2.896 4.728 1.851 3.185 1.66 3.377 2.123 3.569 1.852 4.284 1.196 4.439 1.311 4.787 1.003 4.958 0.465 2.452 0.387 2.97 0 2.589-0.388 2.604 0 3.222-0.774 3.107-1.389 6.041-1.584 3.049-1.154 3.434 0 0.829 0.538 1.064 1.583 2.528 6.872 10.149 5.44 7.622 2.583 5.116 3.514 5.577 3.052 6.097 3.511 6.559 3.513 7.336 3.956 8.3 2.22 5.11 2.044 4.959 1.776 5.27 1.738 4.731 1.312 4.958 1.35 4.651 1.703 9.088 1.347 9.302 0.925 8.242 0 11.597-0.617 4.132-0.887 7.08-1.235 6.408-1.89 5.786-0.695 2.377-1.312 2.838-1.119 1.967-1.467 2.452-1.312 1.526-1.659 1.986-1.469 1.599-1.58 1.372-1.893 0.832-1.701 0.846-1.389 0.464-2.121 0-1.37-0.464-2.604-1.292-1.197-0.829-1.234-0.928-1.367-1.234-1.371-1.351-2.277-2.527-2.704-3.569-2.12-3.687-2.127-2.951-2.064-3.436-2.913-6.114-3.279-6.351-0.387-0.215-0.54 0-1.352 0.981-0.772 1.68-1.272 2.067-2.239 6.176-3.358 8.782-4.325 10.514-3.242 5.286-3.417 5.483-4.031 6.174-4.286 6.043-2.198 2.738-2.665 2.973-6.116 6.04 0.537 0.52 0.832 0.85 3.052 1.83 12.735 6.101 5.559 3.126 5.287 3.05 5.25 3.82 4.671 3.973 2.279 1.74 1.699 2.067 1.735 2.375 1.467 2.583 0.771 2.141 0.967 2.606 0.387 2.198 0.462 2.589-0.462 1.757 0 1.752-0.387 1.838-0.967 1.674-0.383 1.312-0.852 1.585-2.314 3.128-2.121 2.53-1.66 1.907-1.391 1.371-3.511 2.588-3.977 2.215-4.246 2.14-4.516 2.065-5.096 1.971-2.703 0.85-2.428 0.676-5.868 1.366-6.097 1.314-6.101 1.293-6.638 1.064-6.869 0.308-7.024 0.847-21.809 0-7.874-0.466-7.334-0.69-7.873-1.063-7.834-0.831-8.26-1.154-7.987-1.987-7.8-1.527-7.756-2.198-7.954-2.841-7.794-2.372-4.091-1.347-3.666-1.318-2.318-0.904-2.275-0.444-6.487 0-7.484-0.543-3.804-0.384-4.883-0.542-3.128 2.817-4.282 2.665-5.79 2.838-6.405 3.511-3.9 1.912-4.051 1.507-8.994 3.661-4.883 1.234-5.115 1.374-7.104 1.369-4.436 0.386-4.707 0.386-4.903 0.54-5.712 0.232-23.33 0-13.183-0.232-12.777-1.312-6.481-0.908-12.353-1.836-6.099-1.234-5.654-1.812-5.654-1.314-5.095-2.043-4.822-1.912-4.478-2.143-3.897-2.354-3.9-2.834-1.312-1.372-1.736-1.66-1.313-1.469-1.196-1.674-1.083-1.685-0.847-1.674-1.218-3.573-0.443-1.85-0.54-2.046 0-1.913 0.54-2.139 0-2.144 0.443-2.142 0-4.267 0.213-2.295 1.005-2.586 0.846-2.586 1.544-3.124 1.119-1.236 0.927-1.37 2.431-2.971 1.929-1.527 1.814-1.08 1.68-1.351 2.681-0.85 2.122-1.293 2.665-1.368 3.049-0.931 3.049-0.921 3.514-0.753 3.355-0.444 3.977-0.542 4.284-0.307 1.139-0.39 0.231 0 0.541-0.457 0-0.525-0.773-1.061-2.295-1.083-5.712-4.958-3.822-3.05-4.438-3.875-4.478-4.366-4.67-5.553-5.324-6.252-2.009-3.376-2.664-3.495-2.276-4.051-2.046-4.44-2.781-4.185-1.812-4.805-2.14-4.805-2.145-5.346-1.581-5.095-1.467-6.349-0.463-0.23-0.444 0-0.231-0.445-0.54 0-0.907 0.445-0.463 0.23-0.619 1.062-0.231 1.312-0.462 1.138-0.81 1.912-2.627 4.651-1.35 2.835-2.142 2.435-2.296 2.968-2.509 3.284-2.662 2.896-3.126 2.814-2.914 2.666-3.185 2.082-3.512 2.201-3.358 1.31-3.977 0.985-3.898 0.365-0.926 0-0.89-0.365-0.693-1.525-1.159-0.771-1.504-3.669-0.926-1.967-1.004-2.838-0.83-2.951-0.444-2.915-1.234-6.635-0.463-3.903 0-12.811 0.463-9.535 0.772-4.879 0.907-5.04 0.83-5.421 1.466-5.016 1.66-5.829 1.697-5.637 2.279-5.79 2.143-5.572 2.951-5.655 2.78-6.097 3.357-5.712 3.954-6.179 4.035-5.578 4.207-6.172 3.514-4.266 4.496-4.979 4.728-4.939 2.201-2.374 2.682-2.682 3.878-3.358 3.976-3.434 6.484-5.79 4.9-3.589zM511.418 958.8c-60.388 0-118.972-11.828-174.132-35.155-53.273-22.534-101.113-54.786-142.192-95.862-41.079-41.081-73.332-88.917-95.865-142.187-23.328-55.156-35.159-113.738-35.159-174.123 0-60.384 11.832-118.969 35.159-174.126 22.533-53.27 54.786-101.107 95.865-142.185 41.079-41.078 88.92-73.33 142.192-95.86 55.161-23.328 113.744-35.158 174.131-35.158s118.971 11.828 174.129 35.158c53.273 22.531 101.113 54.783 142.192 95.86 41.078 41.079 73.332 88.917 95.866 142.184 23.33 55.158 35.159 113.74 35.159 174.126 0 60.383-11.83 118.965-35.159 174.123-22.534 53.272-54.788 101.108-95.866 142.187-41.079 41.078-88.92 73.328-142.192 95.862-55.157 23.326-113.742 35.155-174.129 35.155zM511.418 89.772c-232.536 0-421.718 189.173-421.718 421.699s189.181 421.699 421.718 421.699c232.533 0 421.716-189.173 421.717-421.699 0-232.526-189.181-421.699-421.717-421.699z"
        fill="#272636" p-id="982"></path>
    </svg>
    <span class="qq">: 2711439556</span>
    <svg t="1677927552554" class="icon" id="icon2" viewBox="0 0 1024 1024" version="1.1"
      xmlns="http://www.w3.org/2000/svg" p-id="801" width="40" height="40">
      <path
        d="M918.795922 356.854687c-21.798121-51.476314-52.909055-97.631021-92.514092-137.236058-39.605037-39.605037-85.862083-70.818309-137.236058-92.514092C635.727364 104.590046 579.236458 93.128123 520.903458 93.128123s-114.823906 11.461923-168.142315 33.976414c-51.476314 21.798121-97.631021 52.909055-137.236058 92.514092s-70.818309 85.862083-92.514092 137.236058C100.496502 410.173096 89.034579 466.664002 89.034579 524.997002s11.461923 114.823906 33.976414 168.142315c21.798121 51.476314 52.909055 97.631021 92.514092 137.236058 39.605037 39.605037 85.862083 70.818309 137.236058 92.514092 53.21607 22.514491 109.809314 33.976414 168.142315 33.976414s114.823906-11.461923 168.142315-33.976414c51.476314-21.798121 97.631021-52.909055 137.236058-92.514092 39.605037-39.605037 70.818309-85.862083 92.514092-137.236058 22.514491-53.21607 33.976414-109.809314 33.976414-168.142315S941.310414 410.173096 918.795922 356.854687zM520.903458 911.836898c-213.273636 0-386.839896-173.56626-386.839896-386.839896s173.56626-386.839896 386.839896-386.839896 386.839896 173.56626 386.839896 386.839896S734.177094 911.836898 520.903458 911.836898z"
        p-id="802"></path>
      <path
        d="M711.662602 575.552269l-0.409354-0.102339-78.80072-14.736758c-14.532081-2.660804-29.678193 1.739756-40.423746 11.768939l-24.970618 23.435539c-22.719168-7.573056-82.996602-35.102139-124.443734-121.885269l28.961823-33.669398c10.131521-11.768939 13.611033-27.73376 9.108135-42.572856l-24.76594-83.815311-0.307016-0.921047c-0.921047-2.558465-9.415151-25.175295-33.976414-34.181091-19.751349-7.26604-42.675195-3.274835-68.055167 11.6666l-0.409354 0.204677c-2.660804 1.637418-26.198681 16.885868-43.084549 47.792125-15.657805 28.654807-28.040776 76.446932 1.535079 141.124925 2.353788 6.447332 16.06716 40.628423 50.043574 85.555067 33.56706 44.414951 94.663202 108.785928 195.159704 163.434739l1.023386 0.511693c2.353788 1.125725 41.651809 19.239656 86.169099 19.239656 18.625625 0 38.274635-3.172497 56.388567-12.178293 32.236658-15.862483 53.318409-45.95003 62.835898-89.443934l0.204677-1.023386c0.409354-2.456126 2.149111-15.35079-3.172497-30.087547C753.109734 595.303618 735.814511 580.976214 711.662602 575.552269zM723.124525 639.206876c-6.856686 30.496902-20.160704 50.35059-40.628423 60.482111-41.754148 20.672397-101.008195-4.605237-106.739157-7.163702-92.821107-50.555267-149.209674-109.502299-180.218269-150.130722-33.669398-44.107935-45.540676-76.753948-45.643014-77.060963l-0.307016-0.921047-0.409354-0.921047c-18.011593-39.195683-19.341995-74.093144-3.888867-103.668999 11.154907-21.388767 27.73376-32.85069 29.473516-34.078753 13.611033-7.982411 25.175295-10.95023 32.543674-8.391765 6.037977 2.046772 9.005797 7.880072 9.722167 9.415151l24.458925 82.791925c0.409354 1.535079 0.102339 3.070158-0.921047 4.298221L409.968419 449.26644c-9.51749 11.052568-11.6666 26.812712-5.526284 40.014391 21.695783 46.257046 50.555267 83.508295 85.964421 110.8327 29.268839 22.61683 55.672197 32.441335 68.771537 36.330202 11.461923 3.377174 24.04957 0.409354 32.85069-7.777733l27.938437-26.198681c1.330402-1.228063 3.172497-1.739756 4.912253-1.43274l77.982011 14.532081c14.429742 3.377174 17.4999 10.540875 18.420947 12.997002C723.329202 633.168899 723.226864 637.774136 723.124525 639.206876z"
        p-id="803"></path>
    </svg>
    <span class="tt">: 17848697985</span>
  </div>
  <!-- 教育背景 -->
 
 
  <!-- 作业案例 -->
  <div class="work">
    <p class="zuoye">作业案例</p>
    <a href="导航栏/index2.html">
      <div class="one">
        <p class="one1">下拉菜单</p>
      </div>
    </a>
    <a href="小米商城/index3.html">
      <div class="tow">
        <p class="one2">小米商城手机模块</p>
      </div>
    </a>
    <a href="购物车/01.html">
      <div class="tow2">
        <p class="one2">小米商城购物车1</p>
      </div>
    </a>
    <a href="购物车/01.html">
      <div class="tow3">
        <p class="one2">小米商城购物车2</p>
      </div>
    </a>
    <a href="小米登录注册/denglu.html">
      <div class="tow4">
        <p class="one2">小米商城注册登录</p>
      </div>
    </a>
    <a href="使用event bus组件/eventbus组件.html">
      <div class="tow5">
        <p class="one2">eventbus组件使用</p>
      </div>
    </a>
 <a href="便签/01.html">
      <div class="tow6">
        <p class="one2">便签</p>
      </div>
    </a>
  </div>
 
<a href=" 登录动画/动画.html">
      <div class="tow7">
        <p class="one2">登录动画</p>
      </div>
    </a>
  </div>
</body>

</html>